import React, { Component } from 'react';
import ReactDom from 'react-dom';
import { FormattedMessage, injectIntl } from 'react-intl';
import { actions } from "mirrorx";
import { Message, Button, Modal, FormControl } from "tinper-bee";
import Radio from 'bee-radio';
import moment from 'moment'
import DatePicker from "bee-datepicker";
import FormError from 'components/FormError';
import RefComponent from 'components/RefComponent';
import FormList from 'components/FormList'

let { RangePicker } = DatePicker;

const FormItem = FormList.Item;

class ApprovalModal extends Component {
    constructor(props) {
        super(props);
        this.state = {
        }

    }


    onApprovalModal = () => {
        let {ButtonType } = this.props;
        this.props.form.validateFields((err, _values) => {
            let param;
            if (err) {
                Message.create({ content: '请输入值', color: 'danger' });
            } else {
                if(ButtonType == "ButtonApprove") {
                    if(_values.isAgree == "agreee") {}
                    param = {
                        comment: _values.comment,
                        isAgree: _values.isAgree,
                    }
                }
                this.props.onCloseApproval(param || true);
            }
        })
    }


    render() {
        let { form, onCallback, showApprovalModalModal, ButtonType,onCloseApproval } = this.props;
        let { getFieldProps, getFieldError } = this.props.form;

        let self = this;
        return (
            <Modal
                show={showApprovalModalModal}
                onHide={()=>onCloseApproval(false)} >
                <Modal.Header>
                    <Modal.Title>审批</Modal.Title>
                </Modal.Header>

                <Modal.Body>
                    {ButtonType != "ButtonApprove" &&
                        <h3>确定操作？</h3>
                    }
                    {ButtonType == "ButtonApprove" && <>

                        <FormItem
                            label={'批语'}
                        >   
                            <FormControl
                                {...getFieldProps('comment', {
                                    initialValue: "同意",
                                    rules: [{
                                        message: "请输入",
                                    }],
                                })}
                            />
                        </FormItem>
                        <FormItem
                            label={'批准'}
                            FormError={<FormError errorMsg={getFieldError(`comment`)} />}
                        >
                            <Radio.RadioGroup
                                {
                                ...getFieldProps(`isAgree`, {
                                    initialValue: "agree",
                                    rules: [{
                                        required: true,
                                        message: '请选择',
                                    }],
                                }
                                )}
                            >
                                <Radio value="agree">同意</Radio>
                                <Radio value="rejectToBillMaker">驳回制单人</Radio>
                            </Radio.RadioGroup>
                        </FormItem>
                    </>
                    }
                </Modal.Body>

                <Modal.Footer>
                    <Button onClick={()=>onCloseApproval(false)} style={{ marginRight: 10 }}><FormattedMessage id="js.Ref.Ref224.0012" defaultMessage="关闭" /></Button>
                    <Button onClick={this.onApprovalModal} ><FormattedMessage id="js.com.Pas.0005" defaultMessage="确定" /></Button>
                </Modal.Footer>
            </Modal>

        )
    }
}

export default FormList.createForm()(injectIntl(ApprovalModal))
